<template>
  <div class="app-container transfer-seat-wrap">
    <div class="body-wrap">
      <div class="personal-info-wrap">
        <el-form size="small" :inline="true">
          <el-form-item label="key" prop="ckey" placeholder="搜索key">
            <el-input type="textarea" :rows="3" v-model="queryParams.sql" style="width: 700px" clearable>
            </el-input>
          </el-form-item>
          <el-button @click="handleSearch" size="small" type="primary">查询</el-button>
        </el-form>
        <div class="table-wrap">
          <el-table v-loading="loading" :data="dataList" stripe style="width: 100%">
            <el-table-column v-for="(it, index) in columnList" :key="index" :label="it" :prop="it"></el-table-column>
          </el-table>
        </div>
      </div>
    </div>

  </div>
</template>

<script>
import Api from '@/api/Api.js'
export default {
  data() {
    return {
      loading: false,
      dataList: null,
      queryParams: {
        sql: '',
      },
      columnList:[]
    };
  },
  components: {

  },
  methods: {
    handleSearch() {
      this.getData()
    },
    getData() {
      if(this.queryParams.sql!=null && this.queryParams.sql!=''){
        this.loading = true
        Api.querySql(this.queryParams).then(res => {
          this.loading = false
          if (res.success) {
            this.dataList = res.data.resList;
            this.columnList = res.data.columnList;
          } else {
            return this.$message.error('失败: ' + res.msg)
          }
        })
      }
    }
  },
  mounted() {
    this.getData();
  },
  beforeDestroy() {
  },
};
</script>

<style>


</style>
